#navigationBar {
    background-image: url("../../src/images/navBar\ Image.jpg");
    background-position: 0px -370px;
    background-repeat: no-repeat;
    background-size: cover;
    /* background-attachment: fixed; */
    margin-bottom: 2rem;
}

#navigationBar #color {
    height: 200px;
    color: white;
    /* border: 2px solid red; */
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-family: 'Rubik';
    background-color: rgba(30, 29, 34, 0.5);
}


/* About us */

#navigationBar #AboutUsH {
    font-size: 2rem;
    /* font-weight: bold; */
    margin-bottom: -5px;
}


/* bread cumbs */

#navigationBar #BreadCrumbs {
    font-size: 0.9rem;
    margin-top: 5px;
    justify-content: center;
    align-items: center;
}

#navigationBar #BreadCrumbs a {
    text-decoration: none;
    color: white;
}

#navigationBar #BreadCrumbs a:hover {
    color: var(--txt-color2);
}

#navigationBar #BreadCrumbs span {
    margin: 0rem 0.6rem;
}

#navigationBar #BreadCrumbs #Line {
    background-color: white;
    width: 1px;
    height: 13px;
}

@media (max-width: 1100px) {
    #navigationBar #BreadCrumbs {
        font-size: 0.8rem;
    }
    #navigationBar #AboutUsH {
        font-size: 1.8rem;
    }
}

@media (max-width: 700px) {
    #navigationBar {
        background-position: bottom;
    }
    #navigationBar #color {
        height: 130px;
    }
    #navigationBar #BreadCrumbs {
        font-size: 0.7rem;
    }
    #navigationBar #AboutUsH {
        font-size: 1.5rem;
    }
}